@charset "UTF-8";
/* CSS Document */

body,h1,h3,h2,h4,h5,h6,p,dl,dd,ul,li,ol,td,form,input,fieldset,legend,figure{margin:0; padding:0;}

li{list-style:none;}
a{text-decoration:none; font-size:12px; color:#fff;}
body{font-size:14px; font-family:"微软雅黑"; color:#666; background:#fff;}
img{vertical-align:top; display:block; border:0;}
a,input{outline:none;}
em,i{font-style:normal;}
u{text-decoration: none;}
b,strong,h1,h2,h3,h4,h5,h6{font-weight:normal;}
.clear:after{content:""; display:block; clear:both; height:0; visibility:hidden;}
table{border-collapse:collapse;}
.noborder{background:none;}
.border0{border:none;}

/*楼梯*/
.lt{
   height: 100%;
   width: 4px;
   background: #000000;
   position: fixed;
   right: 0;
   z-index: 4;
   .lt1{
       width: 36px;
       height: 144px;
       
       position: absolute;
       right: 0px;
       top: 313px;
       border-radius: 8px 0 0 8px;
       li{
           a{
           display: block;
           width: 36px;
           height: 36px;
           border-radius: 8px 0 0 8px;
           position: relative;
           p{
               width: 90px;
               height: 36px;
               position: absolute;
               right: 36px;
               background: #666;
               color: #fff;
               text-align: center;
               line-height: 36px;
               border-radius: 7px 0 0 7px;
               display: none;
                 }
            }
       }
       .i1{
           background: url(../images/xfbj.png) no-repeat 0 0;
             width: 36px;
           height: 36px;
           position: relative;
           div{
             display: none;
             width:260px ;
             height: 230px;
             background: #fff;
             position: absolute;
             right: 36px;
             top: 0;
             em{
                 
                 width: 20px;
                 height: 20px;
                 display: block;
                 right: 6px;
                 top: 6px;
                 color: #aaa;
                 font-size: 20px;
                 position: absolute;
             }
             .p1{
                 width:260px ;
                 height: 100px;
                 margin-top: 30px;
                 margin-bottom: 40px;
                 
                 img{
                    margin: 10px auto; 
                    
                 }
                 i{
                     display: block;
                     width: 100%;
                     text-align: center;
                     a{
                         display: inline-block;
                         color: #f70800;
                     }
                 }
             }
             .p2{
                 width: 258px;
                 height: 58px;
                 background: #f2f2f2;
                 a{
                     
                     float: left;
                     margin-top: 15px;
                     margin-left: 25px;
                     
                 span{
                     color: #000;
                     display: block;
                     width: 90px;
                     height: 30px;
                     border-radius: 5px;
                     border:1px solid #ccc;
                     text-align: center;
                     line-height: 30px;
                     
                     
                 }
                 
                }
                a:first-child{
                     margin-right:60px;
                 }
                 a:hover span{
                     border:1px solid #ff504a;
                     color: #ff504a;
                 }
             }
           }
       }
       .i2{
            position: relative;
            background: url(../images/xfbj.png) no-repeat  0 -46px;
            span{
                width: 22px;
                height: 14px;
                border-radius:7px ;
                background: #f70800;
                position: absolute;
                right: 0;
                color: #fff;
                text-align: center;
                line-height: 14px;
                font-size: 12px;
                top:-5px;
            }
       }
       .i3{
           background: url(../images/xfbj.png) no-repeat 0 -92px;
       }
       .i4{
           background: url(../images/xfbj.png) no-repeat 0 -138px;
       }
       li:hover{
           border-radius:0 ;
           p{
               display: block
           }
       }
       .i1:hover{
           background: url(../images/xfbj.png) no-repeat  -46px 0 ;
           
       }
       .i1:hover div{
          display: block;
           
       }
       .i2:hover{
           background: url(../images/xfbj.png) no-repeat  -46px -46px;
           span{
               background: #fff;
               color: #f70800;
           }
       }
       .i3:hover{
           background: url(../images/xfbj.png) no-repeat  -46px -92px;
       }
       .i4:hover{
           background: url(../images/xfbj.png) no-repeat  -46px -138px;
       }

   }
   .lt2{
       width: 36px;
       height: 108px;
       position:absolute ;
       bottom: 0;
       right: 0px;
       
       border-radius: 8px 0 0 8px; 
       li{
           a{
           display: block;
           width: 36px;
           height: 36px;
           border-radius: 8px 0 0 8px;
            p{
               width: 90px;
               height: 36px;
               position: absolute;
               right: 36px;
               background: #666;
               color: #fff;
               text-align: center;
               line-height: 36px;
               border-radius: 7px 0 0 7px;
               display: none;
             } 
          }
       }
       .i5{
          background: url(../images/xfbj.png) no-repeat 0 -184px;
          div{
              width: 132px;
              height: 182px;
              display: none;
              position: absolute;
              right: 36px;
              top:-72px ;
             
              
          }
       }
        .i6{
          background: url(../images/xfbj.png) no-repeat 0 -230px; 
       }
        .i7{
            display: block;
           width: 36px;
           height: 36px;
           p{
             width: 90px;
               height: 36px;
               position: absolute;
               right: 36px;
               background: #666;
               color: #fff;
               text-align: center;
               line-height: 36px;
               border-radius: 7px 0 0 7px;
               display: none;  
           }
          background: url(../images/xfbj.png) no-repeat 0 -276px; 
       }
       li:hover{
           border-radius:0 ;
           p{
               display: block;
           }
       }
       .i5:hover{
          background: url(../images/xfbj.png) no-repeat -46px -184px; 
       }
       .i5:hover div{
           display: block
       }
       .i6:hover{
            background: url(../images/xfbj.png) no-repeat -46px -230px; 
       }
       .i7:hover{
            background: url(../images/xfbj.png) no-repeat -46px -276px; 
       }
   }
  
}
/*.header*/
.header{
    width: 100%;
    height: 28px;
    border-bottom:1px solid #ddddd ;
    background: #f6f6f6;
    font-size:12px ;
    div{
        width: 1000px;
        height: 28px;
        margin:0 auto;
        p{
            width: 270px;
            height: 28px;
            float: left;
            line-height: 28px;
            >img{
               margin-top: 9px;
               display: inline-block;
               
            }
        }
        ul{
             float: right;
             font-size: 12px;
            li{
                float: left;
                padding-top: 6px;
                a{
                    display: block;
                    color: #666;
                   
                    
                    text-align: center;
                    border-right:1px solid #666 ;
                    padding: 0 15px 0 15px;
                  
                } 
                :hover{
                      color: red;
                  }
                
            }
            li:last-child{
                 position: relative;
                img{
                    float: left;
                    margin: 2px 5px 0 13px;   
                }
                 p{     
                        display: none;
                        left: -5px;
                        top :23px;
                        position:absolute;
                        width: 110px;
                        height: 140px;
                        background: #fff;
                        border:1px solid #ccc ;
                        text-align: center;
                        line-height: 8px;
                        font-size: 16px;
                        color: red;
                        img{
                            margin:10px;
                        }
                    }
            }
            li:last-child:hover p{
                display: block;
                z-index: 2;
            }
            li:last-child a{
                        padding:0 0 0 30px;
                        border: 0;
                        
                    }
               
        }
    }
    
}


/*head1*/
.head1{
    width: 1000px;
    height: 79px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    padding-top: 26px;
    img{
        float: left;
    }
    from{
        float: left;
        margin-left:87px;
        width: 420px;
        height: 36px;
        background: aqua;
        display: block;
        input:first-child{
            float: left;
            width: 323px;
            padding-left: 20px;
            border:2px solid #f70801;
            height: 32px;
        }
        input:last-child{
            border: 0;
            width: 73px;
            height: 100%;
            background: #f70801;
            color: #fff;
        }
    }
    div{
        margin-top:4px;
        float: right;
        width: 138px;
        height: 30px;
        border: 1px solid #ddd;
        line-height: 30px;
        color: #000;
        font-weight: 400;
        position: relative;
        background: #fff;
        
        img{
            margin:5px 5px 0 14px;
            float: left;
        }
        span{
            width: 11px;
            height: 30px;
            background: url(../images/4_03.png) center no-repeat ;
            display: block;
            float: right;
            margin-right:10px;
        }
        i{
            width: 22px;
            height: 14px;
            display: block;
            border-radius: 5px;
            background: #f70800;
            color: #fff;
            text-align: center;
            line-height:14px ;
            font-size: 12px;
            position: absolute;
            top:-5px ;
            right: 16px;
        }
        div{
            position: absolute;
            top:25px;
            right: -1px;
            border:1px solid  #ddd;
            width: 285px;
            min-height: 82px;
            
            text-align: center;
            line-height: 82px;
            
            display: none;
        }
        
    }
    :hover span{
            transform: rotateZ(180deg);
            display: block;
        }
    :hover{
        border-bottom: 0;
        
    }
    :hover div{
        
        display: block;
        z-index: -1;
    }
}

/*nav*/
.nav{
    width: 100%;
    height: 40px;
    background: #f70800;
    div{
        width: 1000px;
        height: 40px;
        margin:0 auto;
        
        ul{
           float: left;
            li{
                float: left;
                a{  
                     float: left;
                    line-height: 40px;
                    padding:0 20px;
                } 
               
            }
            :hover{
                background: orangered;
            } 
            .l1{
               background: #bc0600;
               :hover{
                 background: orangered;
             }
             
                }
           
            .l2{
                a{
                    i{
                        img{
                            float: left;
                            margin-top:10px;
                        }
                    }
                }               
            }          
        }
     .nav2{ 
         position: relative;
            width: 130px;
            height: 27px;
            padding-top: 13px;
           line-height: 12px;
           color: #fff;
           float: right;
           font-size: 15px;
           font-weight: 600;
        img{
            float: left;
            margin-right: 5px;
            margin-left: 10px;
            }
         i{
             cursor:pointer;
         }
         span{
            width: 11px;
            height: 23px;
            margin-top: 4px;
            background: url(../images/7_03.png)  no-repeat ;
            display: block;
            float: right;
            margin-right:24px;
        }
         div{
            display: none;
            width: 998px;
            height: 244px;
            position: absolute;
            top: 40px;
            border: 1px solid #f70800;
            right: 0;
            background: #fff;
            >ul{ 
               
                >li{
                    background: none;
                    float: left;
                    width: 139.5px;
                    height: 246px;
                    border-right:1px solid #ccc ;
                    padding:0 13px ;
                   
                    >a{
                        background: none;
                        font-size: 14px;
                        line-height: 45px;
                        margin-top: 6px;
                        color: #000;
                        display: block;
                        width: 104px;
                        height:45px;
                       border-bottom: 1px dashed #aaa;
                       img{
                           margin: 0 auto;
                           background: none;
                       }
                     
                    } 
                    .a1:hover,.a5:hover{                   
                           color:#ff3175 ;       
                       }
                    .a2:hover,.a6:hover{
                        color: deepskyblue;
                    }
                    .a3:hover{
                        color: yellowgreen;
                    }
                     .a4:hover{
                        color: orange;
                    }
                    
                    ul{
                        background: none;
                        text-align: center;
                        padding-top: 10px;
                        li{
                            background: none;
                            a{
                                background: none;
                                color: #000;
                                font-weight: 400;
                               line-height: 24px;
                               width: 100px;
                               
                            }
                            a:hover{
                                color: #ff504a;
                            }
                        }
                    }       
                }
                li:last-child{
                    border: 0;
                }
            }
            }
         }:hover span{
            transform-origin: center 3px;
            transform: rotateZ(180deg);
        }
        .nav2:hover{
            background: orangered;
        }
        .nav2:hover div{
            display: block;
            z-index: 2;
        }
       
    }
   
}

/*banner*/
.banner{
    width: 100%;
    height: 340px;
    
    div{
        width: 1423px;
        margin:0 auto ;
        height: 340px;
        position: relative;
        overflow: hidden;
        p{
            position: absolute;
            width:2846px;
            height: 340px;
            img{
                
                float: left;
            }
        }
   }
}


/*main*/
.main{
   width: 100%;
   min-height: 1000px;
   background: #f2f2f2; 
   padding-top: 22px;
   .div1{
       width:1000px;
       height: 400px;
        margin:0 auto;
       background:#f2f2f2;
      
       
       .div1a{
           position: relative;
           width: 698px;
           height: 400px;
           float: left;
           background: #fff;
            border: 1px solid #eee;
        >i{
           display: block;
           width: 110px;
           height: 44px;
           background: url(../images/icons.png) no-repeat;
           position: absolute;
           top:-3px;
           left: 22px;
           z-index: 2;
       }
       >p{
           width: 26px;
           height: 45px;
           position: absolute;
           background: url(../images/icons.png) 0 -46px no-repeat;
           top: 128px;
           z-index: 2;
       }
       >p:hover{
             background: url(../images/icons.png) 0 -93px no-repeat;
       }
       >span{
           width: 26px;
           height: 45px;
           position: absolute;
           background: url(../images/icons.png) -28px -46px no-repeat;
           right: 0;
           top: 128px;
           z-index: 2;
       }
       >span:hover{
               background: url(../images/icons.png) -28px -93px no-repeat;
           }
           li{
               width: 698px;
               height: 305px;
               border-bottom: 1px solid #eee;
               position: absolute;
           img{
               width: 340px;
               height: 305px;
               float: left;
            }
            div{
                width: 290px;
                height: 264px;
                float: left;
                margin-left: 20px;
                background: #fff;
                >h2{
                    margin-top: 30px;
                    color: #000;
                    font-size: 18px;
                    font-weight: 600;
                }
                >p{
                    width: 290px;
                    height: 32px;
                    font-size: 12px;
                }
                .div1aa{
                    width: 290px;
                    height: 33px;
                    
                    margin: 0;
                    padding-top: 7px;
                    span{
                        width: 70.64px;
                        height: 33px;
                        display: block;
                        font-size: 28px;
                        color:#f70800 ;
                        line-height: 26px;
                        font-size: 500;
                        float: left;
                        margin-right: 10px;
                        a{
                            color:#f70800 ;
                            font-size: 18px;
                        }
                    }
                    p{
                        width: 205px;
                        height: 15px;
                        float: left;
                       
                      em{
                          color: #fff;
                        width: 34px;
                        height: 15px;
                        float: left;
                        border-radius:8px ;
                        background: #9ACD32;
                        margin-right: 5px;
                        text-align: center;
                        line-height: 15px;
                        font-size: 12px;
                        background: #ff504a;
                    }
                    .em2{
                        background: #ff3175;
                    }
                    }
                    u,i{
                        font-size: 12px;
                    }
                    i{
                         text-decoration:line-through;
                    }
                    
                }
                .div1bb{
                    width: 290px;
                    height: 63px;
                    margin: 0;
                    padding-top: 25px;
                    font-size: 12px;
                    img{
                        width: 28px;
                        height: 28px;
                        margin-right: 10px;
                    } 
                    p{
                            width: 252px;
                            height: 28px;
                            float:right;
                            line-height: 28px;
                      }
                     span{
                          width: 252px;
                            height: 30px;
                            float:right;
                            line-height: 30px;
                     }
                }
            }
           }
           .li1{
               z-index: 1;
           }
           .divxt{
               width: 340px;
               height: 90px;
               padding: 0 2px;
               float:left;
               position: absolute;
               bottom: 0;
               i{
                   width: 86px;
                   height: 7px;
                   position: absolute;
                   display: block;
                   top: -10px;
                   background: url(../images/icons.png) 0 -144px;
                   z-index: 2;
               }
               li{
                  width: 340px;
                 height: 90px;  
               img{
                   width: 66px;
                   height: 66px;
                   float: left;
                   margin:12px 9.5px;
                  
               }
               }
           }
       }
       .div1b{
           width: 288px;
           height: 400px;
           float: right;
           background: #fff;
           >img{
               margin:10px 0 5px 15px;
           }
           .div1ba{
               width: 228x;
               height: 116px;
               padding: 20px 15px;
               border-top: 1px solid #eee;
               i{
                   display: block;
                   width: 115px;
                   height: 115px;
                   position: relative;
                   float: left;
                   img{
                       width: 115px;
                       height: 115px;
                   }
                   u{
                       width: 115px;
                       height: 115px; 
                       background: rgba(0,0,0,0.2);
                       position: absolute;
                       top: 0;
                   }
                   u:hover{
                       background: rgba(0,0,0,0.3);
                   }
                   span{
                       position: absolute;
                       display: block;
                       width:42px ;
                       height: 42px;
                       border-radius:50% ;
                       background: url(../images/icons.png) no-repeat 0 -157px;
                       left: 36.5px;
                       top:36.5px;
                   }
               }
               .p1{
                   width: 128px;
                   height: 32px;
                   float: right;
                   font-size:12px ;
               }
               .p2{
                   width: 128px;
                   height: 21px;
                   float: right;
                   font-size:14px ;
                   color: #f80800;
                   margin-top: 5px;
               }
               .p3{
                   width: 128px;
                   height: 16px;
                   float: right;
                   background: #00BFFF;
                   font-size:12px ;
                   margin-top: 5px;
                   background: url(../images/icons.png)   no-repeat -45px -177px  ;
               }
               .p4{
                   width: 90px;
                   height: 23px;
                   background: #ff504a;
                   color: #fff;
                   float: right;
                   margin-right: 38px;
                   margin-top: 8px;
                   font-size: 12px;
                   text-align: center;
                   line-height: 23px;
                   border-radius: 5px;
               }
           }
           .div1bb{
               width: 258px;
               height: 102px;
               margin: 0 15px;
               padding: 20px 0 ;
               border-bottom: 1px solid #eee;
               border-top: 1px solid #eee;
               position: relative;
               p{
                   width: 258px;
                   height: 16px;
                   font-size: 12px;
                   font-weight: 600;
                   margin-bottom: 10px;
                   i{
                       color: #ff504a;
                   }
               } 
               u{
                        display: block;
                        width: 20px;
                        height: 46px;
                        background: url(../images/icons.png) no-repeat  -56px -46px;
                        position: absolute;
                        left: -10px;
                        z-index: 1;
                        top: 70px;
                    }
                    span{
                        display: block;
                        width: 20px;
                        height: 46px;
                        background: url(../images/icons.png) no-repeat  -79px -46px;
                        position: absolute;
                        right: -10px;
                        z-index: 1;
                        top: 70px;
                    }
                    u:hover{
                        background: url(../images/icons.png) no-repeat  -56px -95px;
                    }
                    span:hover{
                        background: url(../images/icons.png) no-repeat  -79px -95px;
                    }
               div{
                   width: 258px;
                   height: 80px;
                   overflow: hidden;
                   position:relative;
                   
                   ul{
                       width: 1080px;
                       height: 80px;
                       position: absolute;
                       li{
                           float: left;
                           width: 270px;
                           height: 80px;
                           
                           a{   
                               position: relative;
                               float: left;
                               img{
                                   width: 80px;
                                   height: 80px;
                                   margin:0 3px;
                               }
                               i{
                                   width: 77px;
                                   height: 17px;
                                   position: absolute;
                                   display: block;
                                   top: 0;
                                   left: 0;
                                   background: url(../images/icons.png) no-repeat -45px -160px;
                                   text-align: center;
                               }
                           }
                       }
                   }
               }
           }
               .div1cc{
                   width: 258px;
                   height: 60px;
                   margin: 0 auto;
                    a{
                        
                        display:inline-block;
                      width: 60px;
                      height: 35px;  
                      
                      margin:18px  7px 0 16px;
                      color: #666;
                      span{
                          display: block;
                          width: 18px;
                          height: 16px;
                          background: url(../images/icons.png) no-repeat 0 -202px;
                          margin:0 auto ;
                      }
                      p{
                          display: block;
                          width: 18px;
                          height: 16px;
                          background: url(../images/icons.png) no-repeat -26px -200px;
                          margin:0 auto ;
                      }
                      i{
                          display: block;
                          width: 18px;
                          height: 16px;
                          background: url(../images/icons.png) no-repeat -56px -200px;
                          margin:0 auto ;
                      }
                      
                    }
                    a:hover{
                        text-decoration: underline;
                        span{
                            transform: translateY(-8px);
                            transition: 1s;
                            
                        }
                        p{
                            transform:  translateY(-8px);
                            transition: 1s;
                        }
                        i{
                            transform: translateY(-8px);
                            transition: 1s;
                        }
                    }
                    
               }
       }
   }
          /*大标题1  biaoti1*/
                    .biaoti1{
                        width: 1000px;
                        height: 63px;
                        margin:0 auto ;
                        background: url(../images/8_03.png) no-repeat ;
                        margin-top: 30px;
                    }
           /*广告图*/
        .guanggao{
            width: 1000px;
            height: 870px;
            margin: 0 auto;
            overflow: hidden;
            ul{
                width: 1020px;
                height: 870px;
                a{
                    img{
                        width: 490px;
                        height: 270px;
                        float: left;
                        margin: 20px 20px 0 0 ;
                    }
                }
            }
        }
         /*大标题2  biaoti2*/
                    .biaoti2{
                        width: 1000px;
                        height: 63px;
                        margin:0 auto ;
                        background: url(../images/8_06.png) no-repeat ;
                        margin-top: 30px;
                    }
         /*商品   shangpin*/
        .shangpin{
            width: 1000px;
            min-height:1000px ;
            margin: 0 auto;
            overflow: hidden;
            ul{
                width: 1020px;
                min-height:900px ;
                li{
                    width: 320px;
                    height: 462px;
                    float: left;
                    margin: 20px 20px 0 0;
                    >div{
                        width: 298px;
                        height: 433px;
                        padding:10px;
                        background: #fff;
                        border: 1px solid #eee;
                        a{
                            width: 298px;
                            height: 433px;
                            display: block;
                            color: #000;
                        img{
                            width: 298px;
                            height: 298px;
                            
                        }
                        em{
                            display: block;
                            width: 278px;
                            height: 52px;
                            font-size: 16px;
                            margin: 0 auto;
                            margin-top: 10px;
                            line-height: 25px;
                        }
                        p{
                            width: 298px;
                            height: 16px;
                            margin: 0 auto;
                           color: #ff504a;
                           text-align: center;
                           line-height: 16px;
                           font-weight: 600;
                        }
                        div{
                            width: 278px;
                            height: 29px;
                            padding: 0 10px;
                            margin-top: 20px;
                            .span1{
                                width: 59.52px;
                                height: 31px;
                                display: block;
                                float: left;
                                line-height: 31px;
                                font-size: 24px;
                                i{
                                    font-size: 18px;
                                }
                            }
                            .span2{
                                width: 76.16px;
                                height: 16px;
                                display: block;
                                float: right;
                                line-height: 35px;
                                text-align: right;
                                i{
                                     color: red;
                                }
                            }
                        }
                        }
                    }
                    >div:hover{
                        border: 1px solid red;
                    }
                }
            }
        }           
                    
}


